<div id="a" name="pre-middle-aend" words="word xxx">
	<div id="b" name="pre" words="xxxx word" class="clz">
		<h1 id="h1">John</h1>
	</div>
</div>

<div id="c" name="xxx-middle-cend" words="xxx xx">
	<input id="input-button" type="button" class="clz" />
	<input id="input-checkbox-disabled" type="checkbox" disabled="disabled" />
	<input id="input-checkbox-checked" type="checkbox" checked="checked" />
	<input id="input-file" type="file" />
	<input id="input-image" type="image" />
	<input id="input-password" type="password" />
	<input id="input-radio" type="radio" />
	<input id="input-reset" type="reset" />
	<input id="input-submit" type="submit"
		style="height:30px;padding-top:10px;border-bottom-width:10px;margin:1px 2px" />
	<input id="input-text" value="some text"
		style="width:30px;padding:10px;border:1px solid;margin:1px 2px 3px 4px" />
</div>

<div id="d" style="display:none">
	<select id="select" multiple="multiple">
		<option>Flowers</option>
		<option selected="selected">Shrubs</option>
		<option>Trees</option>
		<option selected="selected">Bushes</option>
	</select>
</div>

<script id="name-wrap-tmpl" type="text/x-jquery-tmpl">
	<div> {{tmpl "movie"}} <div>
</script>

<script id="movie-tmpl" type="text/x-jquery-tmpl">
	<p><b>${Name}</b> (${ReleaseYear})</p>
</script>

<script id="variable-tmpl" type="text/x-jquery-tmpl">
	<p>${variable}</p>
</script>

<script id="html-tmpl" type="text/x-jquery-tmpl">
	<p>{{html htmlBody}}</p>
</script>

<script id="expression-tmpl" type="text/x-jquery-tmpl">
	<p>${ context.add(a * b, c) }</p>
</script>

<script id="if-tmpl" type="text/x-jquery-tmpl">
	{{if a > 0}} <p>a greater than 0</p> {{/if}}
	{{if a < 0}} <p>a less than 0</p> {{/if}}
</script>

<script id="else-tmpl" type="text/x-jquery-tmpl">
	<p>a {{if a > 0}}greater{{else}}less{{/if}} than 0</p>
</script>

<script id="each-tmpl" type="text/x-jquery-tmpl">
	{{each movies}}
		<p><b>${Name}</b> (${ReleaseYear})</p>
	{{/each}}
</script>

<script id="each-value-tmpl" type="text/x-jquery-tmpl">
	{{each array}} <p>${ $value * 2 }</p> {{/each}}
</script>

<script id="tmpl-tmpl" type="text/x-jquery-tmpl">
	{{tmpl "#movie-tmpl"}}
	<p><i>${Director}</i></p>
</script>

<script id="wrap-tmpl" type="text/x-jquery-tmpl">
	{{wrap "#wrap-p-tmpl"}}
		<b>${Name}</b>
		<i>${ReleaseYear}</i>
	{{/wrap}}
</script>

<script id="wrap-p-tmpl" type="text/x-jquery-tmpl">
	{{each $item.html()}} <p> {{html $value}} </p> {{/each}}
</script>

<script id="wrap-filter-tmpl" type="text/x-jquery-tmpl">
	{{wrap "#wrap-filter-p-tmpl"}}
		<b>${Name}</b>
		<i>${ReleaseYear}</i>
	{{/wrap}}
</script>

<script id="wrap-filter-p-tmpl" type="text/x-jquery-tmpl">
	{{each $item.html("b")}} <p> {{html $value}} </p> {{/each}}
</script>

